<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <link rel="stylesheet" href="assets/dist/css/bootstrap.css" >
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous">
    <link rel="stylesheet" href="style.css">
    <title>财务报销</title>
</head>
<body>
<nav class="navbar navbar-dark col-lg-12 bg-dark ">
    <div class="toggle " onclick="toggleMenu()">
        <img src="bootstrap-outline.svg">
    </div>
    <div class="col-lg-1 ">
        <a class="navbar-brand float-left" href="#">Company name</a>
    </div>

    <div class="navbar-brand col-lg-8 text-center">
        <span >Talk is cheap,show me your code</span>
    </div>

    <ul class="navbar-nav px-3 col-lg-1 text-center">
        <li class="nav-item text-nowrap">
            <a class="nav-link " href="login.html">username</a>
            <!--                    这是 写死的  usename   -->
        </li>
    </ul>
</nav>

<div  class="navigation ">
    <ul>
        <li>
            <a  href="list.html">
                <span class="icon"><i class="fa fa-home" aria-hidden="true"></i></span>
                <span class="title">员工表</span>
            </a>
        </li>
        <li >
            <a  href="yewu.html">
                <span class="icon"><i class="fa fa-user" aria-hidden="true"></i></span>
                <span class="title">业务进度</span>
            </a>
        </li>
        <li >
            <a  href="renshi.html">
                <span class="icon"><i class="fa fa-comment" aria-hidden="true"></i></span>
                <span class="title">人事流程</span>
            </a>
        </li>
        <li >
            <a href="caiwu.html">
                <span class="icon"><i class="fa fa-question-circle" aria-hidden="true"></i></span>
                <span class="title">财务报销</span>
            </a>
        </li>
    </ul>
</div>



<script type="text/javascript">
    function toggleMenu(){
        let navigation = document.querySelector('.navigation');
        let toggle = document.querySelector('.toggle');
        navigation.classList.toggle('active');
        toggle.classList.toggle('active');
    }
</script>

</body>
</html>